<template>
  <div class="preview-pic play" :title="values.videoName" :videoid="values.id">
    <div class="image-wrapper">
      <img v-if="values" class="pic-img" :alt="values.videoName" :src="getUrl(values.pic)">
      <div class="video-detail">
        <span class="txtweight"><i class="iconfont icon-play"></i>&nbsp;{{changeNumber(values.playNumber)}}</span>
        <span class="txtweight"><i class="iconfont icon-good1"></i>&nbsp;{{changeNumber(values.praise)}}</span>
        <span class="txtweight"><i class="iconfont icon-time"></i>&nbsp;{{formatTime(values.duration)}}</span>
      </div>
    </div>
    <slot name="info"></slot>
  </div>
</template>

<script>
import {mixin} from '../mixins/index'
export default {
  mixins:[mixin],
  data(){
    return {
      praiseNum:0,
    }
  },
  name:'play',
  props:['values'],
}
</script>

<style scoped>
@import '../assets/css/previewPic.css';
</style>